class PosFixed{
    //必须使用 transform 作为 显示/隐藏的样式 不然ios 会等到滚动结束才显示
    //部分样式在 mobile/src/common.less
    constructor(el, config = {}) {
        this.$el = $(el);
        this.$elClone = this.$el.clone(true).addClass('posfixed-clone');
        this.defConf = {
            onFixed: ()=>{},
            onUnFixed: ()=>{},
            distance: 0, //距离目标 ${distance} px 提前触发
        };
        this.conf = Object.assign({},this.defConf,config);
        this.isShow = false;
        this.currentStatus = undefined;
        this.$win = $(window);
        this.init();
    }

    init(){
        if(!this.$el.length) return false;
        if(this.$el.parent().css('position') === 'static'){
            this.$el.parent().css({
                position: 'relative'
            });
        }
        this.offsetTop = this.$el.offset().top;
        this.$el.after(this.$elClone);
        this.$win.on('scroll', ()=> {
            this.scroll();
        });
        this.scroll();
        
    }

    scroll(){
        this.isShow = this.offsetTop - this.$win.scrollTop() - this.conf.distance <= 0;
        if(this.isShow !== this.currentStatus){
            if(this.isShow){
                this.$elClone.addClass('active');
                this.conf.onFixed();
            }else{
                this.$elClone.removeClass('active');
                this.conf.onUnFixed();
            }
            this.currentStatus = this.isShow;
        }
    }
}

(function () {
    //部分tab 使用了 js 动态高亮，得等到js 执行完毕
    setTimeout(()=> {
        new PosFixed('.posfixed');
    });
})();
